<template>
  <div id="app">
    <div ref="container" id="container" style="width: 95vw; height: 60vh;z-index: 1;">
      <img :src="myImg" alt=""  style="height: 60vh;width: 100vw;z-index:-1;background-color:#eee;position: absolute;top: 0;left: 0;"></img>
    </div>
  </div>
</template>
<script>
import { Graph, treeToGraphData } from '@antv/g6';
// import G6 from '@antv/g6'
import { Circle, register, ExtensionCategory } from '@antv/g6';
import { color } from 'echarts';
// import rootIcon from '@/z-img/all.png'; // 导入图片
export default {
    data() {
      return {
        myImg:'',
        myGraph:{
          fig: false,
          list: {
            clList: [
                      { "name": "根节点" },
                      { "name": "目录1" },
                      { "name": "目录1-子节点1" },
                      { "name": "目录1-子节点2" },
                      { "name": "目录2" },
                      { "name": "目录2-子节点1" },
                      { "name": "目录2-子节点2" },
                      { "name": "目录3" },
                      { "name": "目录3-子节点1" },
                      { "name": "目录3-子节点2" },
                      { "name": "目录4" },
                      { "name": "目录4-子节点1" },
                      { "name": "目录4-子节点2" },
                      { "name": "目录5" },
                      { "name": "目录5-子节点1" },
                      { "name": "目录5-子节点2" },
                      { "name": "目录6" },
                      { "name": "目录6-子节点1" },
                      { "name": "目录6-子节点2" },
                      { "name": "目录7" },
                      { "name": "目录7-子节点1" },
                      { "name": "目录7-子节点2" },
                      { "name": "目录8" },
                      { "name": "目录8-子节点1" },
            ],
            lineList: [
    { source: "根节点", target: "目录1" },
    { source: "目录1", target: "目录1-子节点1" },
    { source: "目录1", target: "目录1-子节点2" },
    { source: "根节点", target: "目录2" },
    { source: "目录2", target: "目录2-子节点1" },
    { source: "目录2", target: "目录2-子节点2" },
    { source: "根节点", target: "目录3" },
    { source: "目录3", target: "目录3-子节点1" },
    { source: "目录3", target: "目录3-子节点2" },
    { source: "目录3", target: "目录3-子节点3" },
    { source: "目录3", target: "目录3-子节点4" },{ source: "目录3", target: "目录3-子节点9" },
    { source: "目录3", target: "目录3-子节点5" },{ source: "目录3", target: "目录3-子节点10" },
    { source: "目录3", target: "目录3-子节点6" },{ source: "目录3", target: "目录3-子节点11" },
    { source: "目录3", target: "目录3-子节点7" },{ source: "目录3", target: "目录3-子节点12" },
    { source: "目录3", target: "目录3-子节点8" },
    { source: "目录3", target: "目录3-子节点13" },
    { source: "目录3", target: "目录3-子节点14" },
    { source: "目录3", target: "目录3-子节点15" },
    { source: "目录3", target: "目录3-子节点16" },
    { source: "目录3", target: "目录3-子节点17" },
    { source: "目录3", target: "目录3-子节点18" },
    { source: "根节点", target: "目录4" },
    { source: "目录4", target: "目录4-子节点1" },
    { source: "目录4", target: "目录4-子节点2" },
    { source: "根节点", target: "目录5" },
    { source: "目录5", target: "目录5-子节点1" },
    { source: "目录5", target: "目录5-子节点2" },
    { source: "根节点", target: "目录6" },
    { source: "目录6", target: "目录6-子节点1" },
    { source: "目录6", target: "目录6-子节点2" },    { source: "目录6", target: "目录6-子节点14" },
    { source: "目录6", target: "目录6-子节点3" },    { source: "目录6", target: "目录6-子节点15" },
    { source: "目录6", target: "目录6-子节点4" },    { source: "目录6", target: "目录6-子节点16" },
    { source: "目录6", target: "目录6-子节点5" },    { source: "目录6", target: "目录6-子节点17" },
    { source: "目录6", target: "目录6-子节点6" },   
    { source: "目录6", target: "目录6-子节点7" },   
    { source: "目录6", target: "目录6-子节点8" },   
    { source: "目录6", target: "目录6-子节点9" },  
    { source: "目录6", target: "目录6-子节点10" },   
    { source: "目录6", target: "目录6-子节点11" },   
    { source: "目录6", target: "目录6-子节点12" },   
    { source: "目录6", target: "目录6-子节点13" },
    { source: "根节点", target: "目录7" },
    { source: "目录7", target: "目录7-子节点1" },
    { source: "目录7", target: "目录7-子节点2" },
    { source: "根节点", target: "目录8" },
    { source: "目录8", target: "目录8-子节点1" },
    
    // 目录9相关连线
    { source: "根节点", target: "目录9" },
  
      { source: "目录9", target: "目录9-子节点1" },
  { source: "目录9", target: "目录9-子节点2" },
  { source: "目录9", target: "目录9-子节点3" },
  { source: "目录9", target: "目录9-子节点4" },
  { source: "目录9", target: "目录9-子节点5" },
  { source: "目录9", target: "目录9-子节点6" },
  { source: "目录9", target: "目录9-子节点7" },
  { source: "目录9", target: "目录9-子节点8" },
  { source: "目录9", target: "目录9-子节点9" },
  { source: "目录9", target: "目录9-子节点10" },
  { source: "目录9", target: "目录9-子节点11" },
  { source: "目录9", target: "目录9-子节点12" },
  { source: "目录9", target: "目录9-子节点13" },
  { source: "目录9", target: "目录9-子节点14" },

    // 目录10相关连线
    { source: "根节点", target: "目录10" },
    { source: "目录10", target: "目录10-子节点1" },

    // 目录11相关连线
    { source: "根节点", target: "目录11" },
    { source: "目录11", target: "目录11-子节点1" },
    { source: "目录11", target: "目录11-子节点2" },

    // 目录12相关连线
    { source: "根节点", target: "目录12" },
    { source: "目录12", target: "目录12-子节点1" },
    { source: "目录12", target: "目录12-子节点2" },
    { source: "目录12", target: "目录12-子节点3" }, // 3个子节点的连线

    // 目录13相关连线
    { source: "根节点", target: "目录13" },
    { source: "目录13", target: "目录13-子节点1" },
    { source: "目录13", target: "目录13-子节点2" },
    { source: "目录13", target: "目录13-子节点3" },
    { source: "目录13", target: "目录13-子节点4" },
    { source: "目录13", target: "目录13-子节点5" },
    { source: "目录13", target: "目录13-子节点6" },
    { source: "目录13", target: "目录13-子节点7" },

    // 目录14相关连线
    { source: "根节点", target: "目录14" },
    { source: "目录14", target: "目录14-子节点1" },
    { source: "目录14", target: "目录14-子节点2" },

    // 目录15相关连线
    { source: "根节点", target: "目录15" },
    { source: "目录15", target: "目录15-子节点1" },
    { source: "目录15", target: "目录15-子节点2" },
    { source: "目录15", target: "目录15-子节点3" }, // 3个子节点的连线

    // 目录16相关连线
    { source: "根节点", target: "目录16" },
    { source: "目录16", target: "目录16-子节点1" },

    // 目录17相关连线
    { source: "根节点", target: "目录17" },
    { source: "目录17", target: "目录17-子节点1" },
    { source: "目录17", target: "目录17-子节点2" },

    // 目录18相关连线
    { source: "根节点", target: "目录18" },
    { source: "目录18", target: "目录18-子节点1" },
    { source: "目录18", target: "目录18-子节点2" },
    { source: "目录18", target: "目录18-子节点3" }, // 3个子节点的连线

    // 目录19相关连线
    { source: "根节点", target: "目录19" },
    { source: "目录19", target: "目录19-子节点1" },
    { source: "目录19", target: "目录19-子节点2" },
    { source: "目录19", target: "目录19-子节点3" },
    { source: "目录19", target: "目录19-子节点4" },
    { source: "目录19", target: "目录19-子节点5" },
    { source: "目录19", target: "目录19-子节点6" },
    { source: "目录19", target: "目录19-子节点7" },
    { source: "目录19", target: "目录19-子节点8" },
    { source: "目录19", target: "目录19-子节点9" },
    { source: "目录19", target: "目录19-子节点10" },
    { source: "目录19", target: "目录19-子节点11" },
    { source: "目录19", target: "目录19-子节点12" },

    // 目录20相关连线
    { source: "根节点", target: "目录20" },
    { source: "目录20", target: "目录20-子节点1" },

    // 目录21相关连线
    { source: "根节点", target: "目录21" },
    { source: "目录21", target: "目录21-子节点1" },

            ],
            newList: [
    {
      dragable: "true",
      itemStyle: {
        color:{
          color1:'#4c46fb',
          color2:'#9088ff',
        },
          borderWidth: 12,
          borderGradient: ['#87e8de', '#2f55ff'], // 边框渐变色
        shadowBlur: 10,
        borderColor: "#4c46fb",
        shadowColor: "#9088ff",
        },
        

      listRouter: "",
      name: "根节点",
      nums: "0000",
      symbolSize: 60
    },
    {
      // category: "目录1",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
        
      },
      listRouter: "",
      name: "目录1",
      nums: "0001",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
        
      },
      listRouter: "",
      name: "目录1-子节点1",
      nums: "0011",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录1-子节点2",
      nums: "0012",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录2",
      nums: "0002",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录2-子节点1",
      nums: "0021",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录2-子节点2",
      nums: "0022",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录3",
      nums: "0003",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点1",
      nums: "0031",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点2",
      nums: "0032",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点3",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点4",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点5",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点6",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点7",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点8",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点9",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点10",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点11",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点12",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点13",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点14",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点15",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点16",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点17",
      nums: "0032",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录3-子节点18",
      nums: "0032",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录4",
      nums: "0004",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录4-子节点1",
      nums: "0041",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录4-子节点2",
      nums: "0042",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录5",
      nums: "0005",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录5-子节点1",
      nums: "0051",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录5-子节点2",
      nums: "0052",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录6",
      nums: "0006",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点1",
      nums: "0061",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点2",
      nums: "0062",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点3",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点4",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点5",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点6",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点7",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点8",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点9",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点10",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点11",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点12",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点13",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点14",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点15",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点16",
      nums: "0062",
      symbolSize: 25
    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录6-子节点17",
      nums: "0062",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录7",
      nums: "0007",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录7-子节点1",
      nums: "0071",
      symbolSize: 25
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录7-子节点2",
      nums: "0072",
      symbolSize: 25
    },
    {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录8",
      nums: "0008",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录8-子节点1",
      nums: "0081",
      symbolSize: 25

    },
     {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录9",
      nums: "0008",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点1",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点2",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点3",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点4",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点5",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点6",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点7",
      nums: "0081",
      symbolSize: 25

    },{
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录9-子节点8",
      nums: "0081",
      symbolSize: 25

    }, {
      // category: "一级目录",
      dragable: "true",
      itemStyle: {
        borderColor: "rgba(221, 244, 253, 1)",
        borderWidth: 4,
        shadowBlur: 5,
        shadowColor: "#0071a3",
        color:{
          color1:'#267cfd',
          color2:'#65b0fe',
        },
      },
      listRouter: "",
      name: "目录10",
      nums: "0008",
      symbolSize: 45
    },
    {
      // category: "二级节点",
      dragable: "true",
      itemStyle: {
        // borderColor: "#fff",
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        // shadowBlur: 6,
        // shadowColor: "#1fdc6e",
        color:{
          color1:'#3dbfa2',
          color2:'#90f8cc',
        },
      },
      listRouter: "",
      name: "目录10-子节点1",
      nums: "0081",
      symbolSize: 25

    },
    
    // 目录11（2个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录11",
        nums: "0011",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录11-子节点1",
        nums: "00111",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录11-子节点2",
        nums: "00112",
        symbolSize: 25
    },

    // 目录12（3个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录12",
        nums: "0012",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录12-子节点1",
        nums: "00121",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录12-子节点2",
        nums: "00122",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录12-子节点3",
        nums: "00123",
        symbolSize: 25
    },

    // 目录13（1个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录13",
        nums: "0013",
        symbolSize: 45
    },
    {
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点2",
    nums: "00132",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点3",
    nums: "00133",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点4",
    nums: "00134",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点5",
    nums: "00135",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点6",
    nums: "00136",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点7",
    nums: "00137",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录13-子节点8",
    nums: "00138",
    symbolSize: 25
},
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录13-子节点1",
        nums: "00131",
        symbolSize: 25
    },

    // 目录14（2个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录14",
        nums: "0014",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录14-子节点1",
        nums: "00141",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录14-子节点2",
        nums: "00142",
        symbolSize: 25
    },

    // 目录15（3个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录15",
        nums: "0015",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录15-子节点1",
        nums: "00151",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录15-子节点2",
        nums: "00152",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录15-子节点3",
        nums: "00153",
        symbolSize: 25
    },

    // 目录16（1个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录16",
        nums: "0016",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录16-子节点1",
        nums: "00161",
        symbolSize: 25
    },

    // 目录17（2个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录17",
        nums: "0017",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录17-子节点1",
        nums: "00171",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录17-子节点2",
        nums: "00172",
        symbolSize: 25
    },

    // 目录18（3个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录18",
        nums: "0018",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录18-子节点1",
        nums: "00181",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录18-子节点2",
        nums: "00182",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录18-子节点3",
        nums: "00183",
        symbolSize: 25
    },

    // 目录19（2个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录19",
        nums: "0019",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录19-子节点1",
        nums: "00191",
        symbolSize: 25
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录19-子节点2",
        nums: "00192",
        symbolSize: 25
    },
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点3",
    nums: "00193",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点4",
    nums: "00194",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点5",
    nums: "00195",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点6",
    nums: "00196",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点7",
    nums: "00197",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点8",
    nums: "00198",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点9",
    nums: "00199",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点10",
    nums: "001910",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点11",
    nums: "001911",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点12",
    nums: "001912",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点13",
    nums: "001913",
    symbolSize: 25
},
{
    dragable: "true",
    itemStyle: {
        borderColor: "rgba(222, 253, 234, 0.72)",
        borderWidth: 6,
        color: { color1: '#3dbfa2', color2: '#90f8cc' }
    },
    listRouter: "",
    name: "目录19-子节点14",
    nums: "001914",
    symbolSize: 25
},
    // 目录20（1个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录20",
        nums: "0020",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录20-子节点1",
        nums: "00201",
        symbolSize: 25
    },
    // 目录20（1个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录21",
        nums: "0020",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录21-子节点1",
        nums: "00201",
        symbolSize: 25
    },// 目录20（1个子节点）
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(221, 244, 253, 1)",
            borderWidth: 4,
            shadowBlur: 5,
            shadowColor: "#0071a3",
            color: { color1: '#267cfd', color2: '#65b0fe' }
        },
        listRouter: "",
        name: "目录22",
        nums: "0020",
        symbolSize: 45
    },
    {
        dragable: "true",
        itemStyle: {
            borderColor: "rgba(222, 253, 234, 0.72)",
            borderWidth: 6,
            color: { color1: '#3dbfa2', color2: '#90f8cc' }
        },
        listRouter: "",
        name: "目录22-子节点1",
        nums: "00201",
        symbolSize: 25
    },
            ]
          }
        },
      }
    },
  mounted() {
    const imgUrl = require('../src/assets/mapbg.png');
    this.myImg = imgUrl.default
    this.initAntv();
  },
  beforeDestroy() {
    // 移除滚动事件监听
    this.$refs.container.removeEventListener('scroll', this.handleScroll);
    if (this.graph) {
      this.graph.destroy();
    }
  },
  methods: {
/**
 * 将lineList和newList转换为嵌套树形结构
 * @param {Array} lineList 节点关系列表（source-target）
 * @param {Array} newList 节点属性列表（包含name等信息）
 * @returns {Object} 嵌套树形结构的根节点
 */
 convertToTree(lineList, newList) {
    // 1. 建立name到节点的映射（快速查找节点）
    const nodeMap = {};
    newList.forEach(node => {
        nodeMap[node.name] = node; // 以name为key，存储节点
    });

    // 2. 建立父节点到子节点的映射（记录每个节点的所有子节点名称）
    const parentToChildren = {};
    lineList.forEach(relation => {
        const { source, target } = relation;
        if (!parentToChildren[source]) {
            parentToChildren[source] = []; // 初始化子节点数组
        }
        parentToChildren[source].push(target); // 记录子节点
    });

    // 3. 递归构建树形结构
    function buildTree(nodeName) {
        // 从映射表中获取当前节点（若不存在，返回null）:
        const currentNode = nodeMap[nodeName];
        if (!currentNode) return null;

        // 构建当前节点的基础结构（仅包含id）
        const treeNode = {
            id: currentNode.name, // 以name作为id
            ...currentNode
        };

        // 查找当前节点的子节点，递归构建children
        const childrenNames = parentToChildren[nodeName] || [];
        if (childrenNames.length > 0) {
            treeNode.children = [];
            childrenNames.forEach(childName => {
                const childNode = buildTree(childName);
                if (childNode) {
                    treeNode.children.push(childNode);
                }
            });
        }

        return treeNode;
    }

    // 4. 从根节点开始构建树（假设根节点名称固定为"根节点"）
    return buildTree("根节点");
},
    initAntv() {
const newdata = {
  nodes:this.myGraph.list.newList.map(item=>{return {id:item.name,...item}}),
  edges:this.myGraph.list.lineList
}
const data = this.convertToTree(this.myGraph.list.lineList,this.myGraph.list.newList.map(item=>{return {id:item.name,...item}}))
console.log(data) 
const graph = new Graph({
      container: 'container',
      autoFit: 'view',
      data: treeToGraphData(data),
      behaviors: ['activate-relations','drag-element','drag-canvas', 'zoom-canvas',  {
      type: 'collapse-expand',
      trigger: 'click',
      enable:true,
      animation: {
        duration: 200, 
      },
        onCollapse: (id) => {
        console.log(`节点 ${id} 已收起`);
        // 执行自定义逻辑
      },
      onExpand: (id) => {
        console.log(`节点 ${id} 已展开`);
        
        // 执行自定义逻辑
      },
    },],
      node: {
        // type:'dual-label-node',
        style: {
          labelText: (d) => d.id,
          labelFill: (d)=>d.id.split('-')[1]?'#666':'#fff',
            labelBackgroundFill: 'rgba(250, 140, 22, 0)',
          labelBackground: true,
            labelPlacement: (d)=>d.id.split('-')[1]?'bottom':'center',
          size:(d)=>d.symbolSize,
          fill:(d)=>`r(0.6,0.4,0.9) 0:${d.itemStyle.color.color2} 1:${d.itemStyle.color.color1}`,
          stroke:(d)=> d.itemStyle.color.color2, //节点边框颜色

      shadowColor:(data)=>data.itemStyle.color.color2,
      shadowBlur:20
        },
        animation: {
          enter: false,
        },
      },
      edgeRouting: {
type: 'orthogonal', // 使用正交路由
},
       edge: {
        type: 'polyline',
    style: {
          endArrow: {
            path: 'M 0,0 L 8,4 L 8,-4 Z',
            fill: '#e2e2e2',
            
          },
          endArrowType:'circle',
          endArrowSize:6,
          endArrowStrokeOpacity:0.6,
        },
  },
      layout: {
       type: 'radial',
        // nodeSize: 32,
        unitRadius: 150,
        linkDistance: 240,
        preventOverlap: true,
        maxPreventOverlapIteration: 100,
        strictRadial: false,
        // nodeSep: 40,
        // rankSep:  140,
      },
    });

      graph.render();    // 渲染图
    },
   
  }
};
</script>

<style scoped>
/* 可以添加组件的样式 */
#chart{
  height: 100vh;
  width: 100vw;
}
</style> 